<template>
    <div class="partnerList">
        <div class="partnerList_bottom">
            <!-- <div class="partnerList_bottom_new">
				<div class="partnerList_bottom_new_goods">
					<div class="partnerList_bottom_new_goods_btn">
						<button @click="addRecommend"><i class="el-icon-trophy"></i>新增小区</button>
					</div>
				</div>
			</div> -->
            <div class="partnerList_table">
                <div class="partnerList_bottom_table">
					<table>
						<tr>
							<th></th>
							<th>序号</th>
							<th v-for="(item,index) in thItem" :key="index">{{item}}</th>
							<th>操作</th>
						</tr>
						<template v-if="tabsNum=='2'">
							<tr v-for="(v,i) in tableList" :key="i">
								<td>
									<font class="checkbox" :class="{'check_active' : checkBoxAll.includes(i)}" @click="handlerCheckbox(i)"><i class="el-icon-check"></i></font>
								</td>
								<td>{{v.id}}</td>
                <td>{{v.title}}</td>
								<td></td>
								<td>{{v.house_type}}</td>
								<td>{{v.area}}</td>
								<td>{{v.sale_price}}万元</td>
								<td>
									<button class="editor" @click="toEditHouse(v.id)">详情</button>
									<button class="shelves" @click="toDelHouse(v.id)">删除</button>
								</td>
							</tr>
						</template>
						<template v-if="tabsNum=='3'">
							<tr v-for="(v,i) in tableList" :key="i">
								<td>
									<font class="checkbox" :class="{'check_active' : checkBoxAll.includes(i)}" @click="handlerCheckbox(i)"><i class="el-icon-check"></i></font>
								</td>
								<td>{{v.id}}</td>
								<td>{{v.title}}</td>
								<td>{{v.house_type}}</td>
								<td>{{v.area}}</td>
								<td>{{v.orientation}}</td>
								<td>{{v.sale_price}}万元</td>
								<td>{{v.area_price}}</td>
								<td>
									<button class="editor" @click="toEditSource(v.id)">详情</button>
									<button class="shelves" @click="toDelSource(v.id)">删除</button>
								</td>
							</tr>
						</template>
						<template v-if="tabsNum=='4'">
							<tr v-for="(v,i) in tableList" :key="i">
								<td>
									<font class="checkbox" :class="{'check_active' : checkBoxAll.includes(i)}" @click="handlerCheckbox(i)"><i class="el-icon-check"></i></font>
								</td>
								<td>{{v.id}}</td>
								<td>
									<div class="logoImg">
										<img v-if="v.avatar" style="max-width:100%;max-height:100%;" :src="v.avatar.path" alt="">
									</div>
								</td>
								<td>{{v.title}}</td>
								<td>{{v.name}}</td>
								<td>{{v.phone}}</td>
								<td>{{v.status==0?'下架':'上架'}}</td>
								<td>
									<el-input style="width:80px;margin-right:10px;" size="small" v-model="v.sort"></el-input>
                                	<el-button type="primary" style="width:60px;text-align:center;" size="mini" @click="changeSort(v.id,v.sort)">确定</el-button>
								</td>
								<td>
									<!-- <button class="editor" style="width:60px;" @click="toEditSource(v.id)">改排序</button> -->
									<button class="shelves" @click="toDelDesgin(v.id)">删除</button>
								</td>
							</tr>
						</template>
						<template v-if="tabsNum=='5'">
							<tr v-for="(v,i) in tableList" :key="i">
								<td>
									<font class="checkbox" :class="{'check_active' : checkBoxAll.includes(i)}" @click="handlerCheckbox(i)"><i class="el-icon-check"></i></font>
								</td>
								<td>{{v.id}}</td>
								<td>{{v.id}}</td>
								<td>{{v.first_cate}}</td>
								<td>{{v.second_cate}}</td>
								<td>{{v.product_title}}</td>
								<td>{{v.price}}</td>
								<td>{{v.num}}</td>
								<td>
									<button class="editor" @click="toShopDetail(v.product_id)">详情</button>
									<button class="shelves" @click="toDelHouseShop(v.id)">删除</button>
								</td>
							</tr>
						</template>
						<template v-if="tabsNum=='6'">
							<tr v-for="(v,i) in tableList" :key="i">
								<td>
									<font class="checkbox" :class="{'check_active' : checkBoxAll.includes(i)}" @click="handlerCheckbox(i)"><i class="el-icon-check"></i></font>
								</td>
								<td>{{v.id}}</td>
								<td>{{v.title}}</td>
								<td>{{v.type==0?'普通':v.type==1?'设计师':v.type==2?'施工队':v.type==3?'商家':'小区'}}</td>
								<td>{{v.status==0?'关闭':'开启'}}</td>
								<td>
									<el-button type="primary" size="mini">查看</el-button>
								</td>
								<td>
									<button class="editor" @click="toEdit(v.id)">关闭</button>
									<!-- <button class="shelves" @click="toDel(v.id)">删除</button> -->
								</td>
							</tr>
						</template>
						<tr v-if="tableList.length == 0"><td class="table_title" colspan="10">当前数据空空如也</td></tr>
					</table>
					<div class="partnerList_bottom_page">
						<div class="partnerList_bottom_page_left">
							<div class="partnerList_bottom_page_left_checkAll" @click="handerCheckAll">
								<font class="checkbox" :class="{'check_active' : checkAll}"><i class="el-icon-check"></i></font>
							</div>全选
							<!-- <button class="partnerList_bottom_page_left_btn" @click="selectDel">删除</button> -->
						</div>
						<div class="partnerList_bottom_page_right">
							<el-pagination
								@size-change="handleSizeChange"
								@current-change="handleCurrentChange"
								:current-page="page"
								:page-sizes="[10, 20, 30, 40]"
								:page-size="pageSize"
								layout="total, sizes, prev, pager, next, jumper"
								:total="total"
								background>
							</el-pagination>
						</div>
					</div>
				</div>
            </div>
        </div>
        
    </div>
</template>

<script>
export default {
	props:{
		thItem:{
			type:Array,
			default:[]
		},
		tabsNum:{
			type:String,
			default:''
		},
		estateId:{
			type:String | Number,
			default:null
		}
	},
    data(){
        return{
            cateList:[],
            cate:{},
             input: '',
			checkAll:false,
			page:1,
			pageSize:10,
			total:0,
            checkBoxAll:[],				// 选中的数据
			shelvesAlls:[],
            tableList:[],

        }
    },
	mounted(){

	},

    methods:{
		// 获取户型列表
		getEstateHouseList(){
			let params = {
				estate_id:this.estateId,
				// keyword:this.input,
				page:this.page,
				pagesize:this.pageSize
			}
			this.$http.post('/api/root/EstateHouse/index',params).then(res=>{
				console.log(res,'户型列表');
				if(res.code==1){
					this.tableList = res.data.list?res.data.list:[]
					this.total = res.data.total
				}
			})
		},

		// 获取房源列表
		getHouseList(){
			let params = {
				estate_id:this.estateId,
				// keyword:this.input,
				page:this.page,
				pagesize:this.pageSize
			}
			this.$http.post('/api/root/EstateRoom/index',params).then(res=>{
				console.log(res,'房源列表');
				if(res.code==1){
					this.tableList = res.data.list?res.data.list:[]
					this.total = res.data.total
				}
			})
		},

		// 获取设计师推荐列表
		getDesginList(){
			let params = {
				estate_id:this.estateId,
				// keyword:this.input,
				page:this.page,
				pagesize:this.pageSize
			}
			this.$http.post('/api/root/EstateDesigner/index',params).then(res=>{
				console.log(res,'推荐设计师列表');
				if(res.code==1){
					this.tableList = res.data.list?res.data.list:[]
					this.total = res.data.total
				}
			})
		},

		// 获取家居推荐列表
		getEstateProductList(){
			let params = {
				estate_id:this.estateId,
				page:this.page,
				pagesize:this.pageSize
			}
			this.$http.post('/api/root/EstateProduct/index',params).then(res=>{
				console.log(res,'家居列表');
				if(res.code==1){
					this.tableList = res.data.list?res.data.list:[]
					this.total = res.data.total
				}
			})
		},

		// 获取直播列表
		getLiveList(){
			let params = {
				estate_id:this.estateId,
				page:this.page,
				pagesize:this.pageSize
			}
			this.$http.post('/api/root/EstateLive/index',params).then(res=>{
				console.log(res,'直播列表');
				if(res.code==1){
					this.tableList = res.data.list?res.data.list:[]
					this.total = res.data.total
				}
			})
		},

		// 进入户型详情
		toEditHouse(id){
			this.$router.push({name:'estateHouseAdd',query:{house_id:id}})
		},

		// 进入房源详情
		toEditSource(id){
			this.$router.push({name:'houseSource',query:{source_id:id}})
		},
		// 户型删除
		toDelHouse(id){
			this.$confirm('确定要删除该户型吗？','提示',{
				confirmButtonText:'确定',
				cancelButtonText:'取消',
				type:'warning'
			}).then(()=>{

				this.$http.post('/api/root/EstateHouse/del',{id}).then(res=>{
					console.log(res,'删除结果');
					if(res.code==1){
						this.$message.success('删除成功')
						this.getEstateHouseList()
					}else{
						this.$message.warning(res.msg)
					}
				})
			}).catch(()=>{})
		},
		// 删除房源
		toDelSource(id){
			this.$confirm('确定要删除该房源吗？','提示',{
				confirmButtonText:'确定',
				cancelButtonText:'取消',
				type:'warning'
			}).then(()=>{

				this.$http.post('/api/root/EstateRoom/del',{id}).then(res=>{
					console.log(res,'删除结果');
					if(res.code==1){
						this.$message.success('删除成功')
						this.getHouseList()
					}else{
						this.$message.warning(res.msg)
					}
				})
			}).catch(()=>{})
		},

		 // 删除设计师
        toDelDesgin(id){
            this.$confirm('确定删除该设计师吗？','提示',{
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                this.$http.post('/api/root/EstateDesigner/del',{id}).then(res=>{
                    console.log(res,'删除结果');
                    if(res.code==1){
                        this.getDesginList()
                        this.$message.success('删除成功')
                    }else{
                        this.$message.warning(res.msg)
                    }
                })
            }).catch(()=>{
                console.log('点击取消');
            })
        },

		// 删除家居推荐商品
		toDelHouseShop(id){
			this.$confirm('确定要删除该商品吗？','提示',{
				confirmButtonText:'确定',
				cancelButtonText:'取消',
				type:'warning'
			}).then(()=>{
				this.$http.post('/api/root/EstateProduct/del',{id}).then(res=>{
					console.log(res,'删除家居商品结果');
					if(res.code==1){
						this.$message.success('删除成功')
						this.getEstateProductList()
					}else{
						this.$message.warning(res.msg)
					}
				})
			}).catch(()=>{})
		},
		// 家居商品详情
		toShopDetail(id){
			this.$router.push({name:'shopDetail',query:{id}})
		},
        
        // 搜索
        handerSeach(){
            this.getEstateList()
		},

		// 详情按钮
		toEdit(id){
			this.$router.push({name:'estateAdd',query:{id}})
		},

		// 设计师排序按钮
        changeSort(id,sort){
            console.log(id,sort,'=====');

			let sor = {[`${id}`]:sort}
			let sortArr = JSON.stringify(sor)
			console.log(sortArr,'排序');
            this.$http.post('/api/root/EstateDesigner/saveOrder',{sort:sortArr}).then(res=>{
                console.log(res,'排序结果');
                if(res.code==1){
                    this.getDesginList()
                    this.$message.success('操作成功')
                }else{
                    this.$message.warning(res.msg)
                }
            })
        },

         
          // 多选
			handlerCheckbox(i){
                console.log(i);
				let arr = this.checkBoxAll;
				if(arr.includes(i)){
					let index = arr.indexOf(i);
					if(index != -1){
						arr.splice(index,1);
						this.shelvesAlls.splice(index,1);
						if(this.checkBoxAll.length !== this.tableList.length) {
							this.checkAll = false;
						}
					}
				}else {
					this.checkBoxAll.push(i);
					this.shelvesAlls.push(this.tableList[i].id);
					if(this.checkBoxAll.length == this.tableList.length) {
						this.checkAll = true;
					}
				};
				console.log(this.shelvesAlls);
			},
            // 全选与全不选
			handerCheckAll(){
				this.checkAll = !this.checkAll;
				let arr = this.tableList.length;
				this.checkBoxAll = [];
				this.shelvesAlls = [];
				if(this.checkAll){
					for(let i=0;i<arr;i++){
						this.checkBoxAll.push(i);
					}
					this.checkBoxAll.map(v => {
					this.shelvesAlls.push(this.tableList[v].id.toString());;
				})
				}else {
					this.checkBoxAll = [];
					this.shelvesAlls = []
				}
				console.log(this.shelvesAlls);
			},

            // // 全选后的删除
            // selectDel(){
			// 	console.log(this.shelvesAlls);
			// 	let res =[...new Set(this.shelvesAlls)]; //去重
			// 	console.log(res);
			// 	let str = res.join(',');
			// 	if(this.shelvesAlls.length){
			// 		this.$confirm('此操作将删除选中项, 是否继续?', '提示', {
			// 			confirmButtonText: '确定',
			// 			cancelButtonText: '取消',
			// 			type: 'warning'
			// 		}).then(()=>{
			// 			this.$http.post('/api/root/designer/del',{id:str}).then(res=>{
			// 				console.log(res);
			// 				if(res.code==1){
			// 					this.getDesigList();
			// 					this.checkAll=false;
			// 					this.checkBoxAll=[];
			// 					this.shelvesAlls=[];
			// 					this.$message({
			// 						type:'success',
			// 						message:'删除成功'
			// 					})
			// 				}
			// 			})
			// 		})
			// 	}else{
			// 		this.$message({
			// 			type:'info',
			// 			message:'请选择要删除的项'
			// 		})
			// 	}
			// },
			

        	handleSizeChange(val) {
				this.pageSize = val;
				if(this.tabsNum=='2'){
					this.getEstateHouseList()
				}
			},
			handleCurrentChange(val) {
			    this.page = val;
				if(this.tabsNum=='2'){
					this.getEstateHouseList()
				}
			},
    }
}
</script>

<style lang="less" scoped>
@import 'tablePublic.less';
</style>
